<div class = "main-view"><!--最外层div-->
    <div class="left-margin top-margin"><strong class="am-text-primary am-text-lg">小区信息管理</strong></div>
    <form class="am-form-inline left-margin top-margin" role="form">
        <!--<div class="am-form-group">-->
            <!--<label>地区:</label> <input type="text" class="am-form-field">-->
            <!--<label> 小区名称:</label> <input type="text" class="am-form-field">-->
            <!--<label> 开通时间:</label> <input type="text" class="am-form-field">-->
        <!--</div>-->
        <div class = "city-cascading" style = "display: inline-block;" id = "cascad-search"></div>
        <br><br>
        <div class="am-form-group">
            <label>状态:</label>
            <select style="height: 32px" ng-model="valid">
                <option value=''>全部</option>
                <option value=1>已开通</option>
                <option value=0>已关闭</option>
            </select>
            <label>是否生效:</label>
            <select style="height: 32px" ng-model="init">
                <option value=''>全部</option>
                <option value=1>已生效</option>
                <option value=0>未生效</option>
            </select>
        </div>

        <div style = "display: inline-block;"><button type="submit" class="am-btn am-btn-primary" ng-click="search($event)" data-target = "cascad-search">搜索</button></div>
        <br>
    </form>
    <br>
    <div class="am-btn-group am-btn-group-xs left-margin top-margin">
        <button type="button" class="am-btn am-btn-default" data-am-modal="{target: '#doc-modal-add', width: 800, height: 600}"  ng-click="addCommunity()"><span class="am-icon-plus"></span> 添加小区</button>
        <!--<button type="button" class="am-btn am-btn-default" ng-click="exportCommunity()"><span class="am-icon-plus"></span> 导出</button>-->
    </div>
    <div id = "pagination" class = "pagination"></div>
    <div class="pagination-table left-margin" id="tab_menu" style = "margin-top: 0px;">
        <form class="am-form">
            <table class="am-table-striped am-table-hover table-main">
                <thead>
                <tr>
                    <th class="table-check"><input type="checkbox" ng-click="allSelected()"></th>
                    <th class="table-title">小区ID</th>
                    <th class="table-title">城市\地区</th>
                    <th class="table-title">名称</th>
                    <th class="table-title">地址</th>
                    <th class="table-title">户数</th>
                    <th class="table-title">App人数</th>
                    <th class="table-title">邮编</th>
                    <th class="table-title">常用电话</th>
                    <th class="table-title">生效日期</th>
                    <th class="table-title">操作</th>
                </tr>
                </thead>
                <tbody>
                <tr ng-repeat="community in communityList" id = "{{community.objId}}">
                    <td class="table-check"><input type="checkbox" class = "item-check"></td>
                    <td>{{community.objId}}</td>
                    <td>{{community.cityId.name}}</td>
                    <td>{{community.communityName}}</td>
                    <td>{{community.communityAddress}}</td>
                    <td>{{community.households}}</td>
                    <td>{{community.uCount}}</td>
                    <td>{{community.communityPostCode}}</td>
                    <td width="500">
                        <div ng-repeat="m in community.phoneList">
                            <input ng-model="m.name" data-provide="typeahead" disabled/>
                            <input ng-model="m.phoneNo" data-provide="typeahead" disabled/>
                            <input ng-model="m.address" data-provide="typeahead" disabled/>
                        </div>
                    </td>
                    <td>{{community.dateEffective | date:'yyyy-MM-dd HH:mm:ss'}}</td>

                    <td>
                        <button class="am-btn am-btn-default am-btn-xs am-text-secondary" ng-click="editClick(community,$index)"><span class="am-icon-pencil-square-o"></span> 编辑</button>
                        <div ng-hide="community.isValid"><button class="am-btn am-btn-default am-btn-xs am-hide-sm-only"  ng-click="openCommunity(community)"><span class="am-icon-pencil-square-o"></span> 开启</button></div>
                        <div ng-show="community.isValid"><button class="am-btn am-btn-default am-btn-xs am-text-danger am-hide-sm-only"  ng-click="closeCommunity(community)"><span class="am-icon-pencil-square-o"></span> 关闭</button></div>

                        <!--community.isValid-->

                    </td>
                </tr>
                </tbody>
            </table>
        </form>
    </div>

    <div class = "left-margin">共<span id = 'page_number'>{{pageNumber}}</span>页 <span>{{count}}条数据</span></div>


    <!--新增框 -->
    <div class="am-modal am-modal-no-btn" tabindex="-1" id="doc-modal-add">
        <div class="am-modal-dialog">
            <div class="am-modal-hd border-bottom" style = "text-align: left;">新增小区
                <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
            </div>
            <div class="am-modal-bd body-area text-left">
                <form>
                    <div class = "city-cascading" style = "display: inline-block;" id = "cascad-search-add"></div>
                    <div><label>小区名称</label><input type="text" class = "modal-input" ng-model="addData.communityName"></div>
                    <div><label>小区地址</label><input type="text" class = "modal-input" ng-model="addData.communityAddress"></div>
                    <div><label>经度</label><input type="text" class = "modal-input" ng-model="addData.longitude"></div>
                    <div><label>纬度</label><input type="text" class = "modal-input" ng-model="addData.latitude"></div>
                    <div><label>开发商</label><input type="text" class = "modal-input"  ng-model="addData.developer"></div>
                    <div><label>住宅类型</label><input type="text" class = "modal-input"  ng-model="addData.propertyType"></div>
                    <div><label>物业</label><input type="text" class = "modal-input"  ng-model="addData.property"></div>
                    <div><label>价格</label><input type="text" class = "modal-input"  ng-model="addData.price"></div>
                    <div><label>邮编</label><input type="text" class = "modal-input" ng-model="addData.communityPostCode"></div>
                    <div><label>小区建造日期</label><input type="text" id="dateBuild-add" class="form-control datepicker" style = "width: 200px;height: 30px;" data-date-format="yyyy-mm-dd" ng-model="addData.dateBuild"></div><br>

                    <div>
                        <label>小区logo</label>
                        <div class="col-xs-5">
                            <input type="file" id="pict" required
                                   onchange="angular.element(this).scope().selectFile(this.files)" accept="image/*">
                        </div>
                    </div>
                    <br>
                    <!--<div><label>生效日期</label><input type="date" ng-model="addData.dateEffective"></div>-->

                    <div><label>户数</label><input type="text" class = "modal-input" ng-model="addData.households"></div><br>
                    <div><label>显示单元号</label>
                        <input type="checkbox" ng-model="addData.unitSwitch" ng-checked="addData.unitSwitch">
                        <!--<select data-am-selected="{btnSize: 'sm'}" style = "width: 100px;display: inline-block;"  ng-model="addData.unitSwitch">-->
                        <!--<option value=false>否</option>-->
                        <!--<option value=true>是</option>-->
                        <!--</select>-->
                    </div><br><br>
                </form>


            </div>
            <div class = "button-area border-top">
                <button type="button" class="am-btn am-btn-success right-margin top-margin" ng-show="true" ng-click="add(addData, $event)" data-target = "cascad-search-add">保存</button>
            </div>
        </div>
    </div>

    <!--编辑框 -->
    <div class="am-modal am-modal-no-btn" tabindex="-1" id="doc-modal-edit">
        <div class="am-modal-dialog">
            <div class="am-modal-hd border-bottom" style = "text-align: left;">编辑小区信息
                <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
            </div>
            <div class="am-modal-bd body-area">
                <div style = "width:80%" class = "text-left">
                    <form>
                        <div class = "city-cascading" style = "display: inline-block;" id = "cascad-edit"></div>
                        <div><label>小区名称</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="updateData.communityName"></div><br>
                        <div><label>小区地址</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="updateData.communityAddress"></div><br>
                        <div><label>经度</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="updateData.location.longitude"></div><br>
                        <div><label>纬度</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="updateData.location.latitude"></div><br>
                        <!--<div><label>生效日期</label><input type="date" style = "width: 200px;display: inline-block;" ng-model="community.dateEffective" id="dateEffective_edit"></div>-->
                        <div><label>户数</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="updateData.households"></div><br>
                        <div><label>邮编</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="updateData.communityPostCode"></div><br>
                        <div><label>开发商</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="updateData.developer"></div><br>
                        <div><label>住宅类型</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="updateData.propertyType"></div><br>
                        <div><label>物业</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="updateData.property"></div><br>
                        <div><label>价格</label><input type="text" class = "modal-input" style = "width: 200px;display: inline-block;" ng-model="updateData.price"></div><br>
                        <div><label>小区建造日期</label><input type="text" id="dateBuild" class="form-control datepicker" style = "width: 200px;height: 30px;display: inline-block;" data-date-format="yyyy-mm-dd" ng-model="updateData.dateBuild"></div><br>
                        <div><label>常用电话:</label><br>
                            <div ng-repeat="m in updateData.phoneList">
                                <input ng-model="m.name" data-provide="typeahead" placeholder="姓名"/>
                                <input ng-model="m.phoneNo" data-provide="typeahead" placeholder="电话号码"/>
                                <input ng-model="m.address" data-provide="typeahead" placeholder="地址"/>
                                <button ng-click="deletePhoneNo(updateData, $index)">删除</button>
                            </div>
                            <button ng-click="addPhoneNo(updateData)">添加</button>
                        </div><br>

                        <div><label style = "vertical-align: middle;">显示单元号：</label><input type="checkbox" ng-model="updateData.unitSwitch" ng-checked="updateData.unitSwitch"></div><br>
                        <div><label>小区logo</label>
                            <input type="file" id="pict"
                                   onchange="angular.element(this).scope().selectFile(this.files)" accept="image/*">
                            <img id="logo" style="width: 200px" ng-src="{{updateData.communityLogo}}">
                        </div><br>


                    </form>
                </div>

            </div>
            <div class = "button-area border-top">
                <button type="button" class="am-btn am-btn-success right-margin top-margin" ng-show="true" ng-click="update(updateData,$event)">保存</button>
            </div>
        </div>
    </div>



</div>


<script>


    Date.prototype.format = function (format) {
        var o = {
            "M+": this.getMonth() + 1, //month
            "d+": this.getDate(), //day
            "h+": this.getHours(), //hour
            "m+": this.getMinutes(), //minute
            "s+": this.getSeconds(), //second
            "q+": Math.floor((this.getMonth() + 3) / 3), //quarter
            "S": this.getMilliseconds() //millisecond
        }
        if (/(y+)/.test(format)) format = format.replace(RegExp.$1,
                (this.getFullYear() + "").substr(4 - RegExp.$1.length));
        for (var k in o) if (new RegExp("(" + k + ")").test(format))
            format = format.replace(RegExp.$1,
                    RegExp.$1.length == 1 ? o[k] :
                            ("00" + o[k]).substr(("" + o[k]).length));
        return format;
    };

    var fromDate = $('#dateBuild-add').datepicker().on('changeDate', function (ev) {
        //alert(ev.date.format('yyyy-MM-dd'));
        //$scope.startDate=ev.date.format('yyyy-MM-dd');
        $("#dateBuild-add").val(ev.date.format('yyyy-MM-dd'));
//        alert(ev.date);
    });

    var fromDate = $('#dateBuild').datepicker().on('changeDate', function (ev) {
        //alert(ev.date.format('yyyy-MM-dd'));
        //$scope.startDate=ev.date.format('yyyy-MM-dd');
        $("#dateBuild").val(ev.date.format('yyyy-MM-dd'));
//        alert(ev.date);
    });




</script>